<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
            font-family: "simsun";
        }
        .comment{
            list-style: none;
        }
        li{
            float: left;
            font-size: 50px;
        }
    </style>
    <script src="../jquery-3.5.1.js"></script>
</head>
<body>
    <ul class="comment">
        <li>☆</li>
        <li>☆</li>
        <li>☆</li>
        <li>☆</li>
        <li>☆</li>
    </ul>
    <script>
//         训练提示
       

// 1.鼠标进入某个五角星，当前和之前的所有五角星变为实心，后面的是空心。
$(function(){
    var KX_WJX = "☆";
    var SX_WJX = "★";
    $('.comment li').on('mouseenter',function(){
        $(this).text(SX_WJX).prevAll('li').text(SX_WJX)
        $(this).nextAll('li').text(KX_WJX)
    })
})
// 2.鼠标点击某个五角星，记录该五角星

// 3.鼠标移开后该记录点之前所有变为实心，之后的所有变为空心

    </script>
</body>
</html>